<template>
	<div>
	<h2>头像修改</h2>	
		<hr>
		<div style="display: flex;">
			<div style="width: 25%;height: 100%;">
				<h2>我的图片</h2>
				<div style="width: 10vm;height: 30vh;">
					<img v-bind:src="$ip+`/api/public/showimg/`+$store.state.user.pic" style="width: 100%;height: 100%;"/>
				</div>
			</div>
			<div style="width: 74%;height: 100%;">
				<h2>上传新的图片</h2>
				 请选择新的图片:<input type="file" ref="img"/>
				<hr>
				<button @click="updated()"> 更新我的图片</button>
			</div>
		</div>
		{{doadd}}
	</div>
</template>

<script>
	export default{
		data(){
			return{
				token:"",
				doadd:''
			}
		},
		methods:{
			updated(){
				var that=this
				var fd=new FormData()
				var filex=that.$refs.img.files[0]
				fd.append("mypic",filex)
				console.log(fd)
				this.$axios.post(this.$ip+"/api/user/updatePic",fd,{headers:{'Authorization':that.token}}).then(function(resp){
					that.doadd=resp.data.msg
					that.$store.state.user.pic=resd.data.data
					console.log(resp.data.data)
				})
				
			}
		},
		mounted() {
			this.token=window.localStorage.getItem("token")
		}
	}
</script>

<style>
</style>
